<%@page import="com.jfinal.kit.PropKit" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" import="cn.com.dashihui.web.common.OrderCode" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <title>订单管理</title>
    <jsp:include page="../../../include/header.jsp"></jsp:include>
    <style type="text/css">
			table td{
			 	text-align: center;padding:0px;margin:0px;
			}
		 	table th{
				text-align: center;padding:0px;margin:0px;
		 	}
			table{
				empty-cells:show; 
				border-collapse: collapse;
				margin:0 auto;
			}
 
		</style>
</head>
<body>
<div id="wrapper">

 		<div class="row">
			<div class="col-lg-12">
				<h1 class="page-header">${name} <k font-size="12px;">订单统计</k></h1>
			</div>
		</div>
		<!-- 搜索框 -->
		<!-- <div class="row">
			<div class="col-lg-offset-2 col-lg-9">
				<label class="search-label">订单编号：</label><input type="text" id="sOrderNum" value="" class="form-control search-input width200" maxlength="21">
				<label class="search-label">下单时间：</label><input type="text" id="sBeginDate" autocomplete="off" value="" class="form-control search-input width120 datetimepicker" data-format="yyyy-mm-dd" >
				<label class="search-label">至</label><input type="text" id="sEndDate" autocomplete="off" value="" class="form-control search-input width120 datetimepicker" data-format="yyyy-mm-dd" >
				<label class="search-label">订单状态：</label>
				<div class="search-input">
					<select id="sState" class="selectpicker" data-width="200">
						<option value="0">全部</option>
						<option value="2">待出库</option>
						<option value="3">待评价</option>
						<option value="4">已完成</option>
						<option value="6">待收货</option>
					</select>
				</div>
				<div class="clearfix"></div>
			</div>
			<div class="col-lg-offset-2 col-lg-9">
				<label class="search-label">买家电话：</label><input type="text" id="sTel" value="" class="form-control search-input width200" maxlength="13">
				<button class="btn btn-success search-btn" onclick="query();">确定</button>
				<button class="btn btn-success search-btn" onclick="reset();">重置</button>
				<div class="clearfix"></div>
			</div>
		</div>
 -->		<div class="row">
			<div class="col-lg-12">
				<div class="row">
					<div>
						<div class="text-muted single-line-text pull-left">共 <font color="#428bca" id="dataCount">0</font> 条记录</div>
						<!-- <button onclick="doExcel();"  class="btn btn-success pull-right">导出</button> -->
					</div>
				</div>
				<div class="table-responsive panel panel-default" >
					<table id="dataTable" class="table table-hover table-bordered" style=" overflow:scroll;">
			            <thead>
			               	<tr>
								<th width="200px;">订单号</th>
								<th width="120px;">会员姓名</th>
								<th width="150px;">会员卡号</th>
								<th width="120px;">联系方式</th>
								<th width="200px;">下单分公司</th>
								<th width="200px;">下单时间</th>
								<!-- <th width="100px;">兑换数量</th>
								<th width="100px;">积分类型</th>
								<th width="100px;">所需积分</th> -->
								<th width="80px;">订单总价</th>
								<th width="200px;">支付时间</th>
								<th width="100px;">营业部</th>
								<th width="100px;">状态</th>
							</tr>
			            </thead>
			            <tbody id="dataList"></tbody>
			        </table>
				</div>
		        <div class="row">
		        	<div class="col-lg-12">
		        		<ul id="dataPagination" class="pagination-sm pull-right"></ul>
		        	</div>
		        </div>
			</div>
		</div>

</div>
<jsp:include page="../../../include/javascripts.jsp"></jsp:include>
<!-- 异步加载下一页数据后，用模板渲染 -->
<script type="text/html" id="dataTpl">
		{{each list as item}}
				 <tr id="item{{item.orderNum}}" data-id="{{item.orderNum}}">
					<td><a href="javascript:showOrder('{{item.orderNum}}');"><font color="#40a9ff" ="dataCount">{{item.orderNum}}</font></a></td>
					<td><a href="javascript:showUser('{{item.uid}}');"><font color="#40a9ff" id="dataCount">{{item.name}}</font></a></td>
					<td>{{item.card}}</td>
					<td>{{item.tel}}</td>
					<td>{{item.xdstore}}</td>
					<td>{{item.startDate}}</td>
					<td>{{item.amount}}</td>
					<td>{{item.payDate}}</td>
					<td>{{item.jjrName}}
						{{if !item.jjrName}}--{{/if}}
					</td>
					{{if item.orderState == 1}}
						<td>待付款</td>
					{{else if item.orderState == 2}}
						<td>待出库</td>
					{{else if item.orderState == 3}}
						<td>待评价</td>
					{{else if item.orderState == 4}}
						<td>已完成</td>
					{{else if item.orderState == 5}}
						<td>删除</td>	
					{{else if item.orderState == 6}}
						<td>待收货</td>
					{{else if item.orderState == 7}}
						<td>已退款</td>
					{{else if item.orderState == 9}}
						<td>已过期</td>
					{{/if}}
				</tr>
		{{/each}}
</script>
<script type="text/javascript">
var dataPaginator;
var userId="${userId}";
$(query);
function query(){
	var params = {
		pageSize:10,
		orderNum:$("#sOrderNum").val(),
		beginDate:$("#sBeginDate").val(),
		endDate:$("#sEndDate").val(),
		tel:$("#sTel").val(),
		state:$("#sState").val(),
		id:"${object.id}"
	};
	if(dataPaginator){
		dataPaginator.destroy();
	}
	dataPaginator = Kit.pagination("#dataPagination","${BASE_PATH}/bus/goods/store/goodsOrdergb",params,function(result){
		//设置显示最新的数据数量
		$("#dataCount").html(result.object.totalRow);
		//根据模板渲染数据并填充
		$("#dataList").empty().append(template("dataTpl",result.object));
	});
}
function reset(){
	$("#sOrderNum").val("");$("#sBeginDate").val("");$("#sEndDate").val("");$("#sTel").val("");
	 $("#sStoreId").val("");$("#sStoreId").trigger("change");  $("#sState").val("0");$("#sState").trigger("change");
}
//显示会员详细信息
function showUser(id){
	if(id){
		showDialog = Kit.dialog("会员详情信息","${BASE_PATH}/bus/order/userdetail/"+id,{size:'size-wide',closable:true}).open();
	}else{
		//根据用户Id查询此用户所有订单
		showDialog = Kit.dialog("会员详情信息","${BASE_PATH}/bus/order/userdetail/"+userId,{size:'size-wide',closable:true}).open();
	}
}
//显示订单详细信息
var showOrderDialog;
function showOrder(orderNum){
	showOrderDialog = Kit.dialog("查看订单","${BASE_PATH}/bus/order/detailgb?orderNum="+orderNum,{size:'size-wide',closable:true}).open();
}
function doExcel(){
	var orderNum=$("#sOrderNum").val(),beginDate=$("#sBeginDate").val(), endDate=$("#sEndDate").val(),tel=$("#sTel").val(),state=$("#sState").val(),sellerId=$("#sSellerId").val(),storeId=$("#sStoreId").val(),id="${object.id}";
	window.location.href="${BASE_PATH}/bus/order/doGoodsExcel?orderNum="+orderNum+"&beginDate="+beginDate+"&endDate="+endDate+"&tel="+tel+"&state="+state+"&sellerId="+sellerId+"&storeId="+storeId+"&id="+id;
}
$("#sBeginDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    pickerPosition:'bottom-right',
    autoclose:true,
}).on("click",function(){
	var d2=new Date();
	var d=$("#sEndDate").val();
	if(d==""){
		 $("#sBeginDate").datetimepicker("setEndDate",d2);
	}else{
		var d1=new Date(d); 
		d1.setDate(d1.getDate()-1);
		if(d1>d2){
	  	 	 $("#sBeginDate").datetimepicker("setEndDate",d2);
		}else{
			 $("#sBeginDate").datetimepicker("setEndDate",d1);
		}
	}
});

$("#sEndDate").datetimepicker({
    format: 'yyyy-mm-dd hh:ii:ss',
    minuteStep:1,
    minView:'hour',
    language: 'zh-CN',
    autoclose:true,
	}).on("click",function(){
		var d=$("#sBeginDate").val();
		var d1=new Date(d); 
		d1.setDate(d1.getDate()+1); 
		$("#sEndDate").datetimepicker("setStartDate",d1);
	});
	
 $(document).on("click","#sEndDate",function(){
    	$('#sEndDate').datetimepicker('show');
    });

$(document).on("click","#sBeginDate",function(){
	$('#sBeginDate').datetimepicker('show');
});
</script>
</body>
</html>